import { asyncRoutes, constantRoutes } from '@/router'
import store from '@/store'
const state = {
  routes: []
}
const mutations = {
  setRoutes(state, data) {
    // 真正的菜单应该有静态路由(所有人都有权利访问) + 有权限的动态路由(根据账号数据筛选有权限的账号才能访问) 拼接而成
    //  有权限的动态路由已经从下面的actions里传入,用data接收
    // 静态路由上面引入
    // 去修改渲染菜单layout/components/index
    state.routes = [...constantRoutes, ...data]
  }
}
const actions = {
  filterRoutes() {
    const menus = store.state.user.profile.roles.menus
    const routes = asyncRoutes.filter(item => menus.includes(item.name))
    // const routes = asyncRoutes.filter(item => {
    //   console.log(item.name.includes(menus))
    //   item.name.includes(menus)
    // })
    // 以上逻辑本来是在路由守卫设定,封装在这里是为了同时在两个逻辑上共享
    // 1.恢复url访问(靠return到导航守卫调用 router.addRoutes)
    // 2.希望拼接出一个菜单列表,替换原来的默认路由配置(调用 上面的mutations,并传入 routes有权限的动态列表,用data接收)
    store.commit('permission/setRoutes', routes)
    return routes
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
